<template>
    <div>


    <!-- 住户详情 -->
        <div :id="baseId">
          <personBase :reqId="reqId" :isPrint="isPrint" :baseInfo="applyinfo.base" ></personBase>
        </div>
    <!-- 项目详情 -->
        <div id="projectInfo">
            <div class="qheader" :style="{borderBottom: '0px solid rgb(210,210,210)'}">
                <p>入驻项目信息</p>
            </div>
            <div class="gcontent">
                <Form :id="projectInfoId" ref="projectInfo3" :rules="validate2" :model="applyinfo.projectInfo" :label-width="labelWidth" label-position="left" class="form form_left">
                    <Row>
                        <Col span="8">
                            <FormItem label="工单标题：" prop="reqSubject">
                                <Input v-model="applyinfo.reqSubject" :readonly="ifedit" placeholder="XX公司(部门)+ XX项目申请入驻集中化平台"/>
                            </FormItem>
                        </Col>
                        <Col span="8" class="col_left">
                            <FormItem label="申请类型：" :prop="!ifedit?'alloType':''">
                              <!-- <span >{{applyinfo.remark.alloType == 'first' ? '入驻申请':'扩容申请'}}</span> -->
                              <Input v-if="ifedit" v-bind:value="applyType.find(e => e.key == applyinfo.remark.alloType) != undefined ? applyType.find(e => e.key == applyinfo.remark.alloType).typeName:''" :readonly="ifedit" />
							  <Select v-else v-model="applyinfo.remark.alloType" >
							      <Option :value="i.key" v-for="(i,index) in applyType" :key="index">{{i.typeName}}</Option>
							  </Select>
                            </FormItem>
                        </Col>
                    </Row>
					<Row>
					    <Col span="8">
					        <FormItem label="入驻资源池：" prop="entrySysId">
								<Input v-if="ifedit" v-bind:value="applyinfo.remark.entrySysName" :readonly="ifedit" />
								<Select v-else v-model="applyinfo.remark.entrySysId" @on-change="checkSysName">
								    <Option :value="i.id" v-for="(i,index) in allSysLists" :key="index">{{i.sysName}}</Option>
								</Select>
					        </FormItem>
					    </Col>
					</Row>
                    <Row style="color: #bbb;padding-bottom: 10px" v-if="!ifedit">
                        (注：仅项目经理可以选择租户和项目，来进行提单！)
                    </Row>
                    <Row>
                        <Col span="8">
                            <FormItem label="提单租户：" prop="roleId">
                                <Input v-if="ifedit" v-model="applyinfo.projectInfo.roleName" :readonly="readonly" />
                                <Select v-else v-model="applyinfo.projectInfo.roleId" @on-change="checkRole" :disabled="ifedit">
                                    <Option :value="i.id" v-for="(i,index) in ProleList" :key="index">{{i.tenant_name}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                        <Col span="8" class="col_left">
                            <FormItem label="关联项目：" :prop="!ifedit?'projectId':''">
                                <Input v-if="ifedit" v-model="applyinfo.projectInfo.projectName" :readonly="readonly" />
                                <Select v-else v-model="applyinfo.projectInfo.projectId" @on-change="setProjectName"  :disabled="ifedit">
                                     <Option :value="item.id" v-for="(item,index) in projectList" :key="index">{{item.project}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="8">
                            <FormItem label="开始日期：" >
                                <Input v-model="applyinfo.projectInfo.entryStartTime" :readonly="readonly" />
                            </FormItem>
                        </Col>
                        <Col span="8" class="col_left">
                            <FormItem label="结束日期：" >
                                <Input v-model="applyinfo.projectInfo.entryEndTime" :readonly="readonly" />
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="8">
                            <FormItem label="入驻周期：" >
                                <Input v-model="applyinfo.projectInfo.entryCycle" :readonly="readonly" />
                            </FormItem>
                        </Col>
						<Col span="8" class="col_left">
						    <FormItem label="是否签订合同：">
						        <Input v-model="applyinfo.projectInfo.isContract" :readonly="readonly" />
						    </FormItem>
						</Col>
                        <!-- <Col span="8" class="col_left">
                            <FormItem label="入驻位置：" >
                                <Input v-model="applyinfo.projectInfo.entryPosition" :readonly="readonly" />
                            </FormItem>
                        </Col> -->
                    </Row>
                    <Row>
						<Col span="8">
						    <FormItem label="项目类型：">
						        <Input v-model="applyinfo.projectInfo.projectType" :readonly="readonly" />
						    </FormItem>
						</Col>
                    </Row>
                    <Row >
                        <Col span="8" >
                            <FormItem label="项目经理：">
                                <Input v-model="applyinfo.projectInfo.projectManager" :readonly="readonly" />
                            </FormItem>
                        </Col>
                        <Col span="8" class="col_left">
                            <FormItem label="经理联系方式:">
                                <Input v-model="applyinfo.projectInfo.managerTel" :readonly="readonly"/>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row >
                        <Col span="8" >
                            <FormItem label="运营人员：">
                                <Input v-model="applyinfo.projectInfo.business" :readonly="readonly" />
                            </FormItem>
                        </Col>
                    </Row>
                    <Row >
                        <Col span="22" style="width:96.666667%">
                            <FormItem label="项目主要功能介绍：" >
                                <Input v-model="applyinfo.projectInfo.projectDoc"  type="textarea" :autosize="{minRows: 4,maxRows: 6}" :readonly="readonly" />
                            </FormItem>
                        </Col>
                    </Row>
                </Form>
            </div>
        </div>
    </div>
</template>
<script>
    import ajax from "../../../ajax_util"
    import personBase from '../person_baseInfo.vue'
    export default {
      components:{
        personBase
      },
        data(){
            const validatereqSubject = (rule, value, callback) => {
                if (this.applyinfo.reqSubject === '') {
                    callback(new Error('填写工单标题'));
                }else{
                  if(this.applyinfo.reqSubject.length > 50){
                    callback(new Error('最多填写50个字符'));
                  }else{
                    callback()
                  }
                }
            };
            const validateAlloType = (rule, value, callback) => {
                if (this.applyinfo.remark.alloType == '') {
                    console.log("ssssssssss")
                    callback(new Error('请选择工单申请类型！'));
                }else{
                    callback()
                }
            };
			const validateEntrySysId = (rule, value, callback) => {
			    if (this.applyinfo.remark.entrySysId == '') {
			        callback(new Error('请选择工单入驻系统！'));
			    }else{
			        callback()
			    }
			};

            return {
                dataInfoEdit: 0,
                validate2:{
                    reqSubject:[
                        {required: true,validator: validatereqSubject, trigger: 'blur'}
                    ],
                    roleId: [
                        {required: true,type: 'number', message: '请选择租户角色', trigger: 'change'},
                    ],
                    projectId: [
                        {required: true, type: 'number',message: '请选择关联项目', trigger: 'change'},
                    ],
                    alloType: [
                        {required: true,validator: validateAlloType, trigger: 'change'},
                    ],
					entrySysId: [
                        {required: true,validator: validateEntrySysId, trigger: 'change'},
                    ],
                },
				applyType:[
					{
						key: "first",
						typeName: "新租户入驻"
					},
					{
						key: "expand",
						typeName: "已有租户项目新增数据/资源扩容"
					},
					{
						key: "add_project",
						typeName: "已有租户新项目"
					},
					{
						key: "add_data",
						typeName: "已有租户项目新增数据"
					},
					{
						key: "add_resource",
						typeName: "已有租户项目资源扩容"
					},
				],
                readonly: true, //是否只读
                labelWidth: 140,
                bealoonTrue: true,
                name: "",
                roleList:this.ProleList,
                //项目名称
                projectList: this.PprojectList,
                applyinfo: this.Papply,
                baseId:this.reqId+"base",
                projectInfoId:this.reqId+"project",
				allSysLists: []
            }

        },
        created:function(){
            // this.getRoleLis(this.$store.state.user.id)
			this.getSys()
        },
        mounted:function(){
        },
        methods: {
			checkSysName(id){
				this.applyinfo.remark.entrySysName = this.allSysLists.find(e => e.id == id).sysName
			},
			// 获取所属系统
			getSys(){
				var url = this.CONFIG.progress_url + "/system-map/for/paas"
				var that = this;
				ajax.get({
					url: url,
					that: that,
					params: null,
					success: function(data) {
						that.allSysLists = data
					}
				})
			},
            // //获取租户角色
            // getRoleLis(userId){
            //     var url = this.CONFIG.url_know + "/getRole/" + userId
            //     var that=this;
            //     ajax.get({
            //         url: url,
            //         that: that,
            //         params: null,
            //         success:function(data){
            //             that.roleList = data
            //         }
            //     })
            //     return that.roleList
            // },
            //项目基础信息
            //选择租户
            checkRole(roleId){
                console.log("roleId--->",roleId)
                this.applyinfo.projectInfo = {}
                this.ProleList.some(item =>{
                    if(roleId == item.id){
                        this.applyinfo.projectInfo.roleId = roleId
                        this.applyinfo.projectInfo.roleName = item.tenant_name
                        console.log("projects--->",item.projects)
                        this.projectList = item.projects
                        return true
                    }
                })

                // var url = this.CONFIG.url_know + "/getProjects/" + roleId
                // var that=this;
                // ajax.get({
                //     url: url,
                //     that: that,
                //     params: null,
                //     success:function(data){
                //         console.log("=====",data);
                //         that.projectList = data
                //     }
                // })
            },
            //设置项目名称
            setProjectName(value){
                console.log(value)
                console.log("this.projectList------->",this.projectList)
                this.projectList.some(item =>{
                    if(item.id === value){
                        this.applyinfo.projectInfo.projectName = item.project
                        console.log("item->",item)
                        this.setProjectInfo(item)
                        return true
                    }
                })
            },
            //设置项目基础详情
            setProjectInfo(data){
                // var info = {}
                var info = {}
                info.roleId =  data.tenant_id
                if(data.tenant_name != null){
                    info.roleName = data.tenant_name
                }
                info.projectId = data.id
                info.projectName = data.project
                info.entryStartTime = this.utils.formatDate(new Date(data.create_time*1000), "yyyy-MM-dd")
                info.entryEndTime = this.utils.formatDate(new Date(data.end_time*1000), "yyyy-MM-dd")
                //info.entryStartTime =  data.create_time
                //info.entryEndTime = data.end_time
                info.entryCycle = data.cycle
                info.entryPosition = data.position
                info.isContract = data.isContract
                info.projectType = data.projectType
                info.projectManager = data.manager
                if(data.business == undefined || data.business == null || data.business == ""){
                    info.business = data.tenant_business
                }else{
                    info.business = data.business
                }
                info.managerTel = data.manager_phone
                info.projectDoc = data.des
                this.applyinfo.projectInfo = info
            },

            //数据清单
            //校验是否允许提交
            validate(){
                var isSubmit = false

                this.$refs["projectInfo3"].validate((valid) => {
                    if (valid) {
                        isSubmit = true
                    } else {
                        this.$Message.error('请填写入驻项目基本信息');
                    }
                })


                return isSubmit
            },
            //格式化日期
            formatDate(value) {
                var date = new Date(value*1000);
                var year = date.getFullYear();
                var month = this.padDate(date.getMonth() + 1);
                var day = this.padDate(date.getDate());
                var hours = this.padDate(date.getHours());
                var minutes = this.padDate(date.getMinutes());
                var seconds = this.padDate(date.getSeconds());
                return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
            },
            padDate(value) {
                return value <10 ? '0' + value:value;
            },
        },
        props:{
            isPrint:{
                default:false
            },
            reqId:{
                default:""
            },
            ifedit: {},
            Papply:{},
            ProleList: {},
            PprojectList: {}
        },
        watch:{
            PprojectList(newV,oldV){
                this.projectList = newV
            }
        }
    }
</script>
